.inbiz-tinymce-custom-inset-video-modal {
  .ant-modal-header {
    height: 42px;
    display: flex;
    font-size: 16px;
    color: #222f3e;
    position: relative;
    align-items: center;
    border-bottom: none;
    padding: 8px 16px 0 16px;
    background-color: #fff;
    justify-content: space-between;

    .ant-modal-title>div {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
      margin: 0;
      color: #222f3e;
      font-size: 20px;
      font-weight: 400;
      line-height: 1.3;
      font-style: normal;
      text-transform: none;
    }
  }

  .ant-modal-close {
    top: 8px;
    right: 16px;
    width: 34px;
    height: 34px;
    padding: 4px;
    display: flex;
    color: #222f3e;
    border-radius: 6px;
    align-items: center;
    justify-content: center;

    &:hover {
      box-shadow: unset;
      border-color: transparent;
      background-color: rgba(34, 47, 62, .12);
    }

    .ant-modal-close-x {
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }

  .ant-modal-body {
    padding: 0 16px;
    position: relative;

    .ant-tabs {
      .ant-tabs-nav-wrap {
        .ant-tabs-nav-list {
          padding: 16px 16px 16px 0;
        }

        .ant-tabs-tab {
          padding: 0;
          max-width: 11em;
          margin: 0 0 8px;

          .ant-tabs-tab-btn {
            height: 20px;
            transition: none;
            line-height: 1.3em;
            color: rgba(34, 47, 62, .7);
            text-shadow: 0 0 .25px currentcolor;
            border-bottom: 2px solid transparent;
          }

          &.ant-tabs-tab-active .ant-tabs-tab-btn {
            border-bottom: 2px solid;
            color: var(--ant-primary-color);
          }
        }

        .ant-tabs-ink-bar {
          display: none;
        }
      }

      .ant-tabs-content-holder {
        border-left: none;

        .ant-tabs-tabpane {
          padding: 16px 0 16px 16px;

          .ant-col-24.ant-form-item-label {
            padding: 0;
          }

          label {
            padding: 0;
            height: auto;
            display: block;
            font-size: 14px;
            font-weight: 400;
            line-height: 1.3;
            padding: 0 8px 0 0;
            font-style: normal;
            white-space: nowrap;
            text-transform: none;
            color: rgba(34, 47, 62, .7);
          }

          .ant-form-item {
            width: 100%;
            margin-bottom: 4px;
          }

          .ant-input {
            height: 34px;
          }

          .tiny-suo-btn {
            label {
              opacity: 0;
            }

            .tiny-custom-suo-btn {
              width: 34px;
              height: 34px;
              display: flex;
              cursor: pointer;
              border-radius: 6px;
              align-items: center;
              justify-content: center;

              &:hover {
                background-color: rgba(34, 47, 62, .12)
              }

              &:active {
                background-color: rgba(34, 47, 62, .18)
              }
            }
          }

          .ant-upload.ant-upload-drag {
            height: 113px;
            background: #fff;
            border: 2px dashed #eee;

            .tiny-custom-upload-video-deag {
              display: flex;
              flex-direction: column;
              align-items: center;

              .ant-upload-drag-mess {
                font-size: 16px;
                margin-bottom: 16px;
                color: rgba(34, 47, 62, .7);
              }

              .insert-video-btn {
                height: 34px;
                display: flex;
                color: #fff;
                color: var(--inbiz-color-bg);
                margin: 0 auto;
                font-size: 14px;
                font-weight: 700;
                padding: 4px 16px;
                border-radius: 6px;
                align-items: center;
                background: var(--ant-primary-color);
              }
            }
          }
        }
      }
    }

    .custom-upload-video-footer {
      display: flex;
      padding: 8px 0;
      justify-content: flex-end;

      .ant-btn {
        height: 34px;
        color: #fff;
        margin-left: 8px;
        font-weight: 700;
        padding: 4px 16px;
        border-color: var(--ant-primary-color);
        background-color: var(--ant-primary-color);

        >span {
          display: inline;
        }
      }
    }

    .tiny-custom-loading {
      top: 0;
      left: 0;
      opacity: 0;
      width: 100%;
      height: 100%;
      display: flex;
      position: absolute;
      align-items: center;
      pointer-events: none;
      justify-content: center;
      transition: all ease .3s;
      background-color: rgba(255, 255, 255, 0.75);

      &.loading {
        opacity: 1;
        pointer-events: auto;

      }

      >div {
        animation: tiny-custom-loading-dots 1.5s ease-in-out 0s infinite both;
        background-color: rgba(34, 47, 62, .7);
        border-radius: 100%;
        height: 8px;
        width: 8px;

        &:not(:first-child) {
          margin-left: 4px;
        }

        &:nth-child(1) {
          animation-delay: -.32s;
        }

        &:nth-child(2) {
          animation-delay: -.16s;
        }
      }
    }

    .ant-btn:not(.tox-button--naked) {
      color: var(--inbiz-color-bg);
    }
  }

  .ant-modal-footer {
    padding: 8px 16px;

    .ant-btn {
      height: 34px;
      color: #fff;
      font-weight: 700;
      padding: 4px 16px;
      border-color: var(--ant-primary-color);
      background-color: var(--ant-primary-color);

      >span {
        display: inline;
      }
    }
  }

  .ant-input,
  .ant-btn {
    border-radius: 6px;
  }
}

@keyframes tiny-custom-loading-dots {

  0%,
  100%,
  80% {
    transform: scale(0);
  }

  40% {
    transform: scale(1);
  }
}